<template>
	<view class="">
		<view class="user_head">
			<view class="">
				<view class="" style="margin-bottom: 20px;">
					<u-avatar :src="src"></u-avatar>
				</view>

				<view class="">{{form.stuName}}</view>
			</view>

		</view>
		<view class="">
			<u-form v-model="form">
				<u-form-item label="姓名" label-align="center">
					<u-input v-model="form.stuName" />
				</u-form-item>
				<u-form-item label="邮箱" label-align="center">
					<u-input v-model="form.email"/>
				</u-form-item>
				<u-form-item label="电话" label-align="center">
					<u-input v-model="form.tel" />
				</u-form-item>
				<u-form-item label="爱好" label-align="center">
						<u-input v-model="form.habit" />
					</u-form-item>
				</u-form>
			</u-form>
		</view>
		<view><button type="default" @click="modifyinfo">保存信息</button></view>
		<!-- <view><button type="default" @click="logout">退出登录</button></view> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				src: "http://pic2.sc.chinaz.com/Files/pic/pic9/202002/hpic2119_s.jpg",
				form: {}
			}
		},
		onShow() {
			this.getstupersion();
		},
		methods: {
			logout() {
				uni.removeStorageSync("stuid");
				uni.removeStorageSync("stuname");
				uni.switchTab({
					url: "account"
				})
			},
			getstupersion() {
				this.$http('/stupersion', {
					id: uni.getStorageSync("stuid")
				})
				.then((res) =>{
					this.form = res[0];
					console.log(res[0]);
				})
			},
			modifyinfo(){
				this.$http('/modifyinfo',{
					id: this.form.id,
					stuName: this.form.stuName,
					email:this.form.email,
					tel: this.form.tel,
					habit: this.form.habit
				})
			}
		}
	}
</script>

<style>
	.user_head {
		height: 150px;
		background-color: #c3e3ca;
		display: flex;
		justify-content: center;
		align-items: center;
	}
</style>
